.detail {
  .swiper {
    position: relative;
    swiper,
    swiper-item {
      height: 750rpx;
    }
  
    image {
      width: 100%;
      height: 750rpx;
    }
  
    .wx-swiper-dot {
        width: 12rpx;
        height: 12rpx;
        border-radius: 6rpx;
        background-color: rgba(0, 0, 0, 0.5);
    }
    
    .wx-swiper-dot-active {
        width: 36rpx;
        background: #FFFFFF;
    }
  }
  .msg {
    background: #fff;
    padding: 40rpx 32rpx;
    .tit {
      font-size: 40rpx;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #333333;
      line-height: 56rpx;
      image {
        width: 112rpx;
        height: 44rpx;
        transform: translateY(8rpx);
      }
  
    }
    .progess {
      display: flex;
      margin: 30rpx 0;
      .van-progress {
        border-radius: 0;
      }
      .van-progress__portion {
        border-radius: 0;
      }
      .pro {
        flex: 1;
        padding-top: 12rpx;
      }
      .info {
        margin-left: 22rpx;
        font-size: 24rpx;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #333333;
        line-height: 34rpx;
      }
    }
    .info_list {
      display: flex;
      justify-content: space-between;
      text-align: center;
      .text1 {
        font-size: 32rpx;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #111111;
        line-height: 44rpx;
      }
      .text2 {
        font-size: 24rpx;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #333333;
        line-height: 34rpx;
        margin-top: 8rpx;
      }
    }
  }
  .msg-hao {
    display: flex;
    padding: 24rpx 0;
    font-size: 28rpx;
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    color: #111111;
    line-height: 40rpx;
    display: flex;
    justify-content: space-between;
    .msg_hao_l {
      display: flex;
      align-items: center;
    }
    .fqr {
      width: 88rpx;
      height: 40rpx;
      margin-left: 16rpx;
    }
    .eye {
      width: 42rpx;
      height: 36rpx;
      display: block;
      margin: 0 auto 8rpx;
    }
  }
  .msg-time {
    display: flex;
    justify-content: space-between;
    padding-top: 40rpx;
    .msg-time-l {
      .time {
        display: flex;
        .bg {
          width: 40rpx;
          height: 40rpx;
          background: #000;
          color: #fff;
          text-align: center;
          font-size: 24rpx;
          font-family: PingFangSC, PingFang SC;
          font-weight: 500;
          color: #FFFFFF;
          line-height: 40rpx;
          border-radius: 4rpx;
        }
        .bg1 {
          background: #fff;
          color: #111;
        }
      }
      .text {
        font-size: 24rpx;
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        color: #111111;
        line-height: 24rpx;
        margin-top: 16rpx;
      }
    }
    .msg-time-r {
      text-align: center;
      .text1 {
        font-size: 32rpx;
        font-family: PingFangSC, PingFang SC;
        font-weight: 500;
        color: #111111;
        line-height: 44rpx;
      }
      .text2 {
        font-size: 24rpx;
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        color: #333333;
        line-height: 24rpx;
        margin-top: 16rpx;
      }
    }
  }
  .start {
    margin-top: 12rpx;
    padding: 0 16rpx;
    height: 140rpx;
    display: flex;
    background: #fff;
    .book {
      width: 76rpx;
      height: 76rpx;
      margin-top: 32rpx;
      margin-right: 24rpx;
      border: 1px solid #f3f3f3;
      border-radius: 76rpx;
    }
    .cont {
      flex: 1;
      display: flex;
      .text1 {
        font-size: 32rpx;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #111111;
        line-height: 44rpx;
        margin-top: 48rpx;
        margin-right: 16rpx;
      }
      .fqr {
        width: 88rpx;
        height: 40rpx;
        margin-top: 50rpx;
      }
    }
    .custom {
        padding: 0;
        background: #fff;
        &::after {
            border: 0;
        }
      .customer {
        width: 40rpx;
        height: 40rpx;
        display: block;
        margin: 36rpx auto 0;
      }
      .text2 {
        font-size: 20rpx;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #111111;
        line-height: 28rpx;
      }
    }
    
  }
  .richtext {
    margin-top: 12rpx;
  }
  .info-msg {
    padding: 40rpx 32rpx;
    background: #fff;
    .cont {
      padding: 32rpx 24rpx;
      background: #F8F8F8;
      border-radius: 8px;
      position: relative;
      .card {
        font-size: 24rpx;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #111111;
        line-height: 34rpx;
        text {
          margin-right: 8rpx;
        }
      }
      .detail {
        position: absolute;
        top: 58rpx;
        right: 24rpx;
      }
      .tit {
        font-size: 28rpx;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #111111;
        line-height: 40rpx;
        position: relative;
        &::after {
          content: "";
          position: absolute;
          width: 112rpx;
          left: 0;
          bottom: 8rpx;
          height: 8rpx;
          background: rgba(2, 120, 238, .7);
          border-radius: 8px;
        }
      }
      .tit2 {
        margin-top: 32rpx;
        &::after {
          background: rgba(250, 71, 67, .7);
        }
      }
      .text {
        display: block;
        margin-top: 16rpx;
        font-size: 24rpx;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #666666;
        line-height: 36rpx;
        position: relative;
        .more {
          position: absolute;
          top: 36rpx;
          right: 0;
        }
      }
    }
  }
  .zc {
    height: 160rpx;
    position: relative;
    .zc_bg {
      width: 100%;
      height: 100%;
    }
    .cont {
      position: absolute;
      width: 100%;
      height: 160rpx;
      top: 0;
      left: 0;
      display: flex;
      .plane {
        width: 52rpx;
        height: 48rpx;
        margin-left: 32rpx;
        margin-top: 56rpx;
      }
      .text {
        flex: 1;
        margin-left: 16rpx;
        .text1 {
          font-size: 28rpx;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #111111;
          line-height: 40rpx;
          margin-top: 40rpx;
        }
        .text2 {
          font-size: 24rpx;
          font-family: PingFangSC-Regular, PingFang SC;
          font-weight: 400;
          color: #999999;
          line-height: 34rpx;
          margin-top: 8rpx;
        }
      }
      .zc_btn{
        width: 160rpx;
        height: 60rpx;
        text-align: center;
        line-height: 60rpx;
        font-size: 28rpx;
        border-radius: 8rpx;
        opacity: 0.4;
        border: 2rpx solid #111111;
        margin-top: 50rpx;
        margin-right: 32rpx;
      }
    }
    
  }
  .btn {
    height: 188rpx;
    .button {
      width: 100%;
      height: 188rpx;
      background: #FFFFFF;
      position: fixed;
      bottom: 0;
      .info {
        position: absolute;
        top: -56rpx;
        left: 0;
        right: 0;
        height: 56rpx;
        line-height: 56rpx;
        background: #00C4A1;
        opacity: .6;
        text-align: center;
        font-weight: 400;
        font-size: 24rpx;
        color: #FFFFFF;
        font-family: PingFangSC, PingFang SC;
      }
      button {
        margin: 0 32rpx;
        background: #FA4743;
        border-radius: 16rpx;
        height: 92rpx;
        line-height: 92rpx;
        font-size: 32rpx;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #FFFFFF;
        margin-top: 24rpx;
      }
    }
  }
  .btn-hao {
    .button {
      display: flex;
      .huibao {
        margin-left: 32rpx;
        margin-top: 38rpx;
        font-size: 24rpx;
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        color: #111111;
        line-height: 24rpx;
        margin-right: 30rpx;
        .gift {
          width: 32rpx;
          height: 32rpx;
          margin: 0 auto;
          display: block;
          margin-bottom: 8rpx;
        }
      }
      button {
        flex: 1
      }
    }
  }
  .fix {
    position: fixed;
    top: 810rpx;
    right: 32rpx;
    width: 84rpx;
    height: 84rpx;
  }
  .share {
    top: 910rpx;
  }
  .disabled {
    button {
      opacity: .3;
    }
  }
  .van-popup {
    box-sizing: content-box;
  }
  .van-popup--bottom.van-popup--round {
    border-radius: 16rpx 16rpx 0 0;
  }
  .pop_cont {
    padding: 0 32rpx;
    margin-top: 32rpx;
    .price {
      font-size: 48rpx;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #111111;
      line-height: 66rpx;
      .num {
        font-size: 28rpx;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #666666;
        margin-left: 24rpx;
        line-height: 66rpx;
      }
    }
    .time {
      display: block;
      font-size: 20rpx;
      font-family: PingFangSC, PingFang SC;
      font-weight: 400;
      color: #FF612B;
      line-height: 20rpx;
      border-radius: 4rpx;
      border: 1rpx solid #FF612B;
      padding: 8rpx;
      margin-top: 8rpx;
      display: inline-block;
    }
    .tit {
      font-size: 32rpx;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #111111;
      line-height: 44rpx;
      margin-top: 32rpx;
    }
    .pic {
      width: 200rpx;
      height: 200rpx;
      margin-top: 32rpx;
      display: block;
    }
    .shop_list {
      margin-top: 32rpx;
      font-size: 28rpx;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #666666;
      line-height: 60rpx;
    }
    .xian {
      margin-top: 32rpx;
      height: 2rpx;
      background: #E0E0E0;
    }
    .tit2 {
      font-size: 28rpx;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #111111;
      line-height: 40rpx;
      margin-top: 46rpx;
    }
    .card_list {
      margin-top: 32rpx;
      .card_list_item {
        padding: 14rpx 16rpx;
        font-size: 26rpx;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #111111;
        line-height: 26rpx;
        border: 1rpx solid #111111;
        display: inline-block;
        margin-bottom: 24rpx;
        margin-right: 24rpx;
        overflow: hidden;
        border-radius: 4rpx;
        position: relative;
      }
      .select {
        border: 1rpx solid #FA4743;
        color: #FA4743;
        .select_icon {
          display: block;
          width: 24rpx;
          height: 24rpx;
          position: absolute;
          top: 0;
          right: 0;
        }
      }
      
    }
  }
  .pop_info {
    font-size: 24rpx;
    font-family: PingFangSC, PingFang SC;
    font-weight: 500;
    color: #FA4743;
    line-height: 24rpx;
    background: #FFF0F0;
    padding: 12rpx 0;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 188rpx;
  }
  .pop_info_x {
    bottom: 132rpx;
  }
  .share_box {
    background: #F8F8F8;
    .list {
      background: #fff;
      width: 100%;
      height: 200rpx;
      display: flex;
      justify-content: space-around;
      .item {
        .share_btn {
          width: 100%;
          height: 200rpx;
          background: #fff;
          padding: 0;
          &::after {
            border: 0;
          }
          text {
            display: block;
          }
        }
        image {
          width: 88rpx;
          height: 88rpx;
          display: block;
          margin: 40rpx auto 0;
        }
        text {
          font-size: 24rpx;
          font-weight: 400;
          color: #111111;
          line-height: 24rpx;
          margin-top: 16rpx;
          text-align: center;
        }
      }
    }
    .share_sub {
      margin-top: 16rpx;
      font-size: 32rpx;
      font-weight: 400;
      color: #111111;
      height: 104rpx;
      line-height: 104rpx;
      background: #fff;
      &::after {
        border: 0;
      }
    }
  }

  .share_img {
    display: block;
    width: 700rpx;
    height: 700rpx;
  }

  .share_pic {
    position: fixed;
    width: 480rpx;
    height: 848rpx;
    top: 18%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    border-radius: 8rpx;
  }
  .btn_ {
    padding: 40rpx 0 0;
  }
}